@charset "utf-8";
@keyframes page1_round{
    from{
        opacity: 1;
        
    }
    to{
        transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes page1_p11{
    from{
        transform:translateX(100vw) translateY(72vh) rotateZ(30deg);
        opacity: 0.4;
        
    }
    to{
        transform:translateX(50vw) translateY(72vh) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p10{
    from{
        transform: translateX(-5vw) translateY(72vh) rotateZ(30deg);
        opacity: 0.4;
    }
    to{
        transform: translateX(-5vw) translateY(72vh) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p5{
    from{
        transform: translateY(45vh) translateX(-20vw) rotateX(-90deg);//vh以屏幕的百分比计算
        opacity: 0.4;
    }
    to{
        transform: translateY(45vh) translateX(-20vw) rotateX(0deg);//vh以屏幕的百分比计算
        opacity: 1;
    }
}

@keyframes page1_p5_round{
    from{
        transform: translateY(47vh) translateX(0vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(47vh) translateX(0vw) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_p3{
    from{
        transform: translateY(25vh) translateX(-10vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(25vh) translateX(-10vw) rotateX(0deg);//vh以屏幕的百分比计算
        opacity: 1;
    }
}
@keyframes page1_p1{
    from{
        transform: translateY(-10vh) translateX(-10vw) rotateZ(-70deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(-5vh) translateX(-10vw) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p2{
    from{
        transform: translateY(-3vh) translateX(55vw) rotateZ(-80deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(-3vh) translateX(65vw) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p4{
    from{
        transform: translateY(10vh) translateX(70vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(10vh) translateX(70vw) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_p4_round{
    from{
        transform: translateY(22vh) translateX(70vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(22vh) translateX(70vw) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_p9{
    from{
        transform: translateY(40vh) translateX(80vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(40vh) translateX(80vw) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_p4b{
    from{
        transform: translateY(52vh) translateX(80vw) rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: translateY(52vh) translateX(80vw) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_h1{
    from{
        transform: rotateX(-90deg);
        opacity: 0.4;
    }
    to{
        transform: rotateX(0deg);
        opacity: 1;
    }
}
@keyframes page1_p6{
    from{
        transform:  translateY(-10vh) rotateZ(-180deg);
        opacity: 0.4;
    }
    to{
        transform:  translateY(0vh) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p7{
    from{
        transform:  translateY(-10vh) rotateZ(-180deg);
        opacity: 0.4;
    }
    to{
        transform:  translateY(0vh) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page1_p8{
    from{
        transform:  translateY(-10vh) rotateZ(-180deg);
        opacity: 0.4;
    }
    to{
        transform:  translateY(0vh) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes roundMini{
    from{
        transform: scale(0);
        opacity: 0;
    }
    to{
        transform: scale(1.5);;
        opacity: 1;
    }
}
@keyframes page2_p4{
    from{
        transform: translateY(-30vh) translateX(0vw);
        opacity: 0;
    }
    to{
        transform: translateY(-13vh) translateX(0vw);
        opacity: 1;
    }
}
@keyframes page2_p4_round{
    from{
        transform: translateY(-30vh) translateX(-5vw);
        opacity: 0;
    }
    to{
        transform: translateY(-10vh) translateX(-5vw);
        opacity: 1;
    }
}
@keyframes page2_p2{
    from{
        transform: translateY(-10vh) translateX(20vw) rotateZ(-90deg);
        opacity: 0;
    }
    to{
        transform: translateY(-10vh) translateX(60vw) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page2_p12{
    from{
        transform: translateY(100vh) translateX(60vw) rotateZ(-90deg);
        opacity: 0;
    }
    to{
        transform: translateY(85vh) translateX(65vw) rotateZ(0deg);
        opacity: 1;
    }
}
@keyframes page2_p12_round{
    from{
        transform: translateY(85vh) translateX(56vw);
        opacity: 0;
    }
    to{
        transform: translateY(80vh) translateX(66vw);
        opacity: 1;
    }
}
@keyframes page2_head{
    from{
        transform: translateY(20vh) translateX(20vw) scale(0.1);
        opacity: 0;
    }
    to{
        transform: translateY(20vh) translateX(20vw) scale(1);
        opacity: 1;
    }
}
@keyframes page2_content{
    from{
        transform: translateY(30vh) translateX(-80vw);
        opacity: 0;
    }
    to{
        transform: translateY(30vh) translateX(20vw);
        opacity: 1;
    }
}

@keyframes page2_timeOrWhere{
    from{
        transform: translateY(50vh) translateX(-80vw);
        opacity: 0;
    }
    to{
        transform: translateY(50vh) translateX(20vw);;
        opacity: 1;
    }
}
@keyframes page2_warn{
    from{
        transform: translateY(65vh) translateX(-80vw);
        opacity: 0;
    }
    to{
        transform: translateY(65vh) translateX(20vw);
        opacity: 1;
    }
}
@keyframes page3_p4{
    from{
        transform: translateY(-30vh) translateX(0vw);
        opacity: 0;
    }
    to{
        transform: translateY(-13vh) translateX(0vw);
        opacity: 1;
    }
}
@keyframes page3_p4_round{
    from{
        transform: translateY(-30vh) translateX(17vw);
        opacity: 0;
    }
    to{
        transform: translateY(1vh) translateX(17vw);
        opacity: 1;
    }
}